<template>
  <div class="dta">
   <div demo-bg class="dta">
    <dv-scroll-board :config="config" style="width:24vw;height:25vh; margin:0 auto;"  @mouseover="mouseoverHandler" @click="clickHandler"/>
  </div>
  </div>
</template>

<script setup lang="ts">
import {reactive,onMounted} from 'vue'
import {getduty} from '../../request/index'
const config = reactive({
  header: ['序号', '姓名', '值班内容','地点','手机'],
  data:null,
  index: true,
  columnWidth: [50],
  align: ['center'],
})


onMounted(()=>{
  getduty().then(res=>{
    console.log('值班情况',res.data.data.result[0]);
    let array=res.data.data.result[0]
    const valuesArray=array.map(obj=>Object.values(obj))
   config.data=valuesArray
    console.log('值',valuesArray);
    
  })
})



const mouseoverHandler = (e: any) => {
  console.log(e)
}

const clickHandler = (e: any) => {
  console.log(e)
}
</script>

<style lang="scss" scoped>

</style>